<script setup>

import {getCurrentInstance, ref} from "vue";
import {deleteDictType, listDictType} from "@/api/system/dict_type";
import DictTypeForm from "@/views/system/dict/DictTypeForm.vue";

const {proxy} = getCurrentInstance();
const emits = defineEmits(['handleSelectChange'])
const dictTypeList = ref([]);
const total = ref(0);
const selectIdIndex = ref(-1);
const selectId = ref();
const dictTypeFormRef = ref();
const queryForm = ref({
  pageNo: 1,
  pageSize: 10
})

const getList = async () => {
  const {data} = await listDictType(queryForm.value)
  total.value = data.total;
  dictTypeList.value = data.list;
}

const openDictType = (dictId, type) => {
  dictTypeFormRef.value.open(dictId, type)
}

const handleUpdate = () => {
  if (!selectId.value) {
    proxy.$modal.warningNotify('请选择一条数据');
    return false;
  }
  openDictType(selectId.value, 'update');
}

const handleDelete = () => {
  if (!selectId.value) {
    proxy.$modal.warningNotify('请选择一条数据');
    return false;
  }
  deleteSysDictType(selectId.value)
}

const handleSelectionChange = (index, row) => {
  selectIdIndex.value = index;
  selectId.value = row.dictId
  emits('handleSelectChange', row.dictCode)
}

const deleteSysDictType = async (dictId) => {
  proxy.$modal.confirm('确定删除该字典吗？').then(async () => {
    await deleteDictType(dictId);
    proxy.$modal.okNotify('删除成功');
    await getList();
    emits('handleSelectChange', undefined);
  })
}

getList()
</script>

<template>
  <div class="app-container">
    <a-space wrap class="!mb-4 !mt-4">
      <a-button type="primary" plain class="flex items-center" @click="openDictType(null, 'create')" v-hasPermission="['system:dict_type:add']">
        <icon icon="ep-plus" size="14px" color="unset" class="mr-1"/>
        新增
      </a-button>

      <a-button success plain class="flex items-center" @click="handleUpdate" v-hasPermission="['system:dict_type:edit']">
        <icon icon="ep-edit" size="14px" color="unset" class="mr-1"/>
        编辑
      </a-button>

      <a-button danger plain class="flex items-center" @click="handleDelete" v-hasPermission="['system:dict_type:delete']">
        <icon icon="ep-delete" size="14px" color="unset" class="mr-1"/>
        删除
      </a-button>
    </a-space>

    <a-table :data-source="dictTypeList" :border="true" size="large" :pagination="false">
      <a-table-column width="55">
        <template #default="{record,index}">
          <a-radio v-model="selectIdIndex" :value="index"
                   @change="handleSelectionChange(index,record)"/>
        </template>
      </a-table-column>
      <a-table-column data-index="dictId" title="id"/>
      <a-table-column data-index="dictName" title="字典名称"/>
    </a-table>

    <pagination
        v-show="total > 0"
        :total="total"
        v-model:page="queryForm.pageNo"
        v-model:limit="queryForm.pageSize"
        @pagination="getList"/>

    <dict-type-form ref="dictTypeFormRef" @success="getList"/>
  </div>
</template>

<style scoped lang="scss">

</style>
